<template>
  <!-- 云存储 -->
  <view class="bg-white" :class="modalName ? 'prevents' : ''">
    <!-- 主体内容 -->
    <view class="padding">
      <!-- 标题 -->
      <view v-if="!isIntroduceDetail">
        <view class="text-xl text-primary">时光相册</view>
        <view class="text-primary text-sm margin-tb-xs">自动为你记录美好时光
          时光相册可以为你主动记录美好生活瞬间，拍摄内容可以自动形
          成短视频，为你云端保存，随时分享。</view>
      </view>
      <!-- 支持开通的设备列表 -->
      <device-list v-if="!isIntroduceDetail" :supportDeviceObj="supportDeviceObj"
                   @click="handleSelectDevice"></device-list>
      <!-- 广告 -->
      <ads :isShowTitle="false" :isShowClassify="false" title="目前可自动记录" :list="adList" pathName="xmcAisTimealbum"></ads>
      <channels-modal :modalName="modalName" :info="buttonMessage.channelMessage"
                      @hideModal="hideModal"></channels-modal>

    </view>
    <!-- 按钮 -->
    <buttons v-if="buttonMessage.fail" :classifyId="classifyId" :message="buttonMessage.message"
             :channelMessage="buttonMessage.channelMessage"></buttons>
    <!--		<view>{{ classifyId }} &#45;&#45; {{buttonMessage.message}} &#45;&#45; {{buttonMessage.channelMessage}}</view>-->
  </view>
</template>

<script>
import {getDevice} from './mixins'
import channelsModal from "../components/modal/channels"
import couponModal from "../components/modal/coupon"
import buttons from './module/buttons/buttons'
import ads from './module/ads/ads'
import deviceList from './module/deviceList/deviceList'

export default {
  mixins: [getDevice],
  props: {
    deviceInfo: {
      type: Object,
      default: () => {
        return {
          modalName: null
        }
      }
    }
  },
  components: {
    deviceList,
    buttons,
    ads,
    couponModal,
    channelsModal
  },
  data() {
    return {
      isIntroduceDetail: false,
      adList: [
        {
          col: 3, list: [
            {
              url: 1,
              title: '萌宠瞬间',
              text: '自动识别家庭内如猫狗类宠物，主人不在家也为你随时抓取宠物逗趣瞬间，视频自动保存。'
            },
            {
              url: 2,
              title: '温馨家人',
              text: '自动识别家庭成员，通过人脸人形等形式，无论是孩子珍贵成长过程还是家庭聚会，它能为你一一记录。  *即将上线'
            },
            {
              url: 3,
              title: '亲子时光',
              text: '儿童识别，不错过任何时间和地点，为你记录他成长的每时每刻。  *即将上线'}
          ]
        },
        {
          col: 1, list: [
            {url: 4, title: '自定义相册', text: '通过强大的AI能力，可以自定义标签，建立独一无二的智能个性相册。  *即将上线'},
          ]
        },
      ],
    }
  },
  onLoad(opt) {

  },
  mounted() {
    if (this.deviceInfo) {
      this.modalName = this.deviceInfo.modalName
      this.isIntroduceDetail = this.deviceInfo.isIntroduceDetail
    }
  },
  onShow() {
    const pointData = {code: '600401', eventName: 'click_item_home_cloud'}
    this.$postPointData(pointData)
  },
  methods: {
    channelClick() {
      this.modalName = 'channelsModal'
    },
    hideModal() {
      this.modalName = ''
    }
  }
}
</script>

<style lang="less" scoped>
@import '@/common/style/main.css';
</style>
